<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/mobile/import/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head lang="en">
	<title>用户登录</title>
	<%@ include file="/WEB-INF/views/mobile/import/meta.jsp"%>
	<script src="${ctxStatic}/mall/index_tabs.js"></script>
	<script>
		//返送验证码
		function loginSendCheckCode(){
			if($("#loginMobile").val()==""){
				alert('请输入11位手机号码！');
	           	$("#loginMobile").select();
	          	return false;
			}
			$.ajax({
				cache : false,
				async: false,
				type : "post",
				url : "${ctxShop}/shoping/wxSendCheckCode.shtml",
				data : "mobile="+$("#loginMobile").val(),
				success : function(data) {
					if (data.status==200) {
						var checkCode = data.result;
						//放入cookie
						var cookieService = new  MallCookieService();
						cookieService.setLoginCheckCode(checkCode);
						alert("验证码发送成功！");
					}else{
						alert("验证码发送失败，请重新！");
					}
				},
				error : function() {
					alertError("验证码发送失败!");
				}
			});
			
		}
		
		function registerSendCheckCode(){
			if($("#mobile").val()==""){
				alert('请输入11位手机号码！');
	           	$("#mobile").select();
	          	return false;
			}
			$.ajax({
				cache : false,
				async: false,
				type : "post",
				url : "${ctxShop}/shoping/wxSendCheckCode.shtml",
				data : "mobile="+$("#mobile").val(),
				success : function(data) {
					if (data.status==200) {
						var checkCode = data.result;
						//放入cookie
						var cookieService = new  MallCookieService();
						cookieService.setRegisterCheckCode(checkCode);
						alert("验证码发送成功！");
					}else{
						alert("验证码发送失败，请重新！");
					}
				},
				error : function() {
					alertError("验证码发送失败!");
				}
			});
			
		}
		
		//登录
		function login(){
			if($("#loginMobile").val()==""){
				alert('请输入11位手机号码！');
	           	$("#loginMobile").select();
	          	return false;
			}
			//var mobile=$("#loginMobile").val();
			//var myreg = /^(((13[0-9]{1})|159|153)+\d{8})$/;
	       	/*if(!myreg.test(mobile))
	       	{
	           	alert('请输入有效的手机号码！');
	           	$("#loginMobile").select();
	          	return false;
	       	}*/
	       	if($("#loginCheckCode").val()==""){
	       		alert('请输入4位短信验证码！');
	           	$("#loginCheckCode").select();
	          	return false;
	       	}else{
	       		var cookieService = new  MallCookieService();
				var code = cookieService.getLoginCheckCode();
				if(code!=$("#loginCheckCode").val()){
					alert('验证码无效！');
		           	$("#loginCheckCode").select();
		          	return false;
				}
	       	}
			$.ajax({
				cache : false,
				async: false,
				type : "post",
				url : "${ctxShop}/shoping/wxLoginCheckCode.shtml",
				data : $("#loginForm").serialize(),
				success : function(data) {
					if (data.status==200) {
						var user = data.result;
						//放入cookie
						var cookieService = new  MallCookieService();
						cookieService.setUserId(user.id);
						cookieService.setUserName(user.name);
						cookieService.setMobile(user.mobile);
						//移除登录验证码cookie缓存
						var cookieService = new  MallCookieService();
						cookieService.setLoginCheckCode("");
						alert("登录成功，点击确定完成登录！");
						//跳转到上一页面
						document.location=$("#referer").val();
					}else{
						alert("帐号密码错误，请重新！");
						$("#loginPassword").select();
					}
				},
				error : function() {
					alertError("登录失败!");
				}
			});
		}
		
		//注册
		function register(){
	       	if($("#mobile").val()==""){
	       		alert('请输入11位手机号码！');
	           	$("#mobile").select();
	          	return false;
	       	}
			if($("#registerCheckCode").val()==""){
	       		alert('请输入4位短信验证码！');
	           	$("#registerCheckCode").select();
	          	return false;
	       	}
			//var mobile=$("#mobile").val();
			//var myreg = /^(((13[0-9]{1})|159|153)+\d{8})$/;
	       	/*if(!myreg.test(mobile))
	       	{
	         	alert('请输入有效的手机号码！');
	         	$("#mobile").select();
	        	return false;
	      	}*/	
	      	if($("#password").val()==""){
	       		alert('请设置密码！');
	           	$("#password").select();
	          	return false;
	       	}
	       	
       		var cookieService = new  MallCookieService();
			var code = cookieService.getRegisterCheckCode();
			if(code!=$("#registerCheckCode").val()){
				alert('验证码无效！');
	           	$("#registerCheckCode").select();
	          	return false;
			}
			$.ajax({
				cache : false,
				async: false,
				type : "post",
				url : "${ctxShop}/shoping/wxRegisterCheckCode.shtml",
				data : $("#registerForm").serialize(),
				success : function(data) {
					if (data.status==200) {
						alert("注册成功，点击确定后自动登录！");
						var user = data.result;
						//放入cookie
						var cookieService = new  MallCookieService();
						cookieService.setUserId(user.id);
						cookieService.setUserName(user.name);
						cookieService.setMobile(user.mobile);
						//移除注册验证码cookie缓存
						var cookieService = new  MallCookieService();
						cookieService.setRegisterCheckCode("");
						//跳转到上一页面
						document.location=$("#referer").val();
					}else{
						alert("注册失败！");
					}
				},
				error : function() {
					alertError("注册失败!");
				}
			});
		}
	</script>
</head>
<body>
<!--导航条-->
	<%@ include file="/WEB-INF/views/mobile/import/top.jsp"%>
<nav>
	<div class="container-fluid" style="margin-top: 40px;">
		<ul class="nav nav-tabs">
			<li role="presentation" class="active" style="width: 100%; text-align: center;" id="tab_1"
				onclick="tab_n(1,2)">
				<a href="#">短信验证码登录</a>
			</li>
			<li role="presentation" style="width: 50%; display: none;" id="tab_2"
				onclick="tab_n(2,2)">
				<a href="#">用户注册</a>
			</li>
		</ul>

		<div class="panel panel-default" id="tab_body_1">
			<div class="panel-body">
				<form id="loginForm" class="form-horizontal" method="post">
					<div class="form-group">
						<label for="mobile" class="col-xs-1 col-sm-1 control-label">
						</label>
						<div class="col-xs-10 col-sm-10" style="display: flex;">
							<input class="form-control" id="loginMobile" name="mobile" placeholder="请输入11位手机号码" style="float: left; width: 75%;">
							<button type="button" class="btn btn-default" onclick="loginSendCheckCode()" style="float: right; background-color: #E0630D;">
								验证码
							</button>
						</div>
					</div>
					<div class="form-group">
						<label for="password"
							class="col-xs-1  col-sm-1 control-label">
						</label>
						<div class="col-xs-10 col-sm-10">
							<input type="text" class="form-control" id="loginCheckCode" name="loginCheckCode" placeholder="请输入4位短信验证码">
						</div>
					</div>
					<div class="form-group">
						<label class="col-xs-1  col-sm-1 control-label">
						</label>
						<div class="col-xs-10 col-sm-10" style="text-align: center;">
							<button type="button" class="btn btn-default" onclick="login()" style="width: 100px; background-color: #E0630D;">
								登录
							</button>&nbsp;
							<button type="reset" class="btn btn-default" style="width: 100px; background-color: #E0630D;">
								重置
							</button>
						</div>
					</div>
					<input type="hidden" id="referer" name="referer" value="<%=request.getHeader("Referer")%>">
				</form>
			</div>
		</div>
		<div class="panel panel-default" id="tab_body_2" style="display: none;">
			<div class="panel-body">
				<form id="registerForm" class="form-horizontal" action="${ctxShop}/shoping/wxRegister.shtml" method="post">
					<div class="form-group">
						<label for="mobile" class="col-xs-1 col-sm-1 control-label">
						</label>
						<div class="col-xs-10 col-sm-10" style="display: inline-flex;">
							<input class="form-control" id="mobile" name="mobile"
								placeholder="请输入11位手机号码" style="float: left;">
							<button type="button" class="btn btn-default" onclick="registerSendCheckCode()" style="float: right; background-color: #E0630D;">
								验证码
							</button>
						</div>
					</div>
					<div class="form-group">
						<label for="name" class="col-xs-1 col-sm-1 control-label">
						</label>
						<div class="col-xs-10 col-sm-10">
							<input type="text" class="form-control" id="registerCheckCode" name="registerCheckCode" placeholder="请输入4位短信验证码">
						</div>
					</div>
					<div class="form-group">
						<label for="password"
							class="col-xs-1  col-sm-1 control-label">
						</label>
						<div class="col-xs-10 col-sm-10">
							<input type="password" class="form-control" id="password" name="password" maxlength="16"
								placeholder="设置密码">
						</div>
					</div>
					<div class="form-group">
						<label class="col-xs-1  col-sm-1 control-label">
						</label>
						<div class="col-xs-10 col-sm-10" style="text-align: center;">
							<button type="button" class="btn btn-default" onclick="register()" style="width: 100px; background-color: #E0630D;">
								注册
							</button>&nbsp;
							<button type="reset" class="btn btn-default" style="width: 100px; background-color: #E0630D;">
								重置
							</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</nav>
<script type="text/javascript">
	$("input[name='mobile']").each(function(){
		var width = $(this).parent().width();
		$(this).width(width-100);
	});
</script>
</body>
</html>